<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>京东导航</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        ul {
            width: 100%;
            list-style: none;
        }

        img {
            width: 20px;
            height: 20px;
        }

        .l1 {
            background-color: #e3e4e5;
            width: 100%;
            height: 40px;
        }

        ul li a {
            text-decoration: none;
        }

        select {
            margin-left: 480px;
            border: none;
            background-color: #e3e4e5;
            color: #aea6a8;
        }

        ul li select .sl1 {
            margin-left: 800px;
            border: none;
            background-color: #e3e4e5;
            color: #aea6a8;
        }

        a {
            color: #aea6a8;
        }

        .a2 {
            color: red;
        }

        div {
            float: left;
            margin: 0 auto;
        }

        .img1 {
            width: 200px;
            height: 130px;
            float: left;
        }

        div .d1 {
            background-color: #e1251b;
            height: 40px;
            width: 720px;
            padding-left: 5px;
            padding-top: 5px;
            float: left;
            margin-top: 30px;
            margin-left: 120px;
        }

        div .d2 {
            background-color: #fff;
            width: 640px;
            height: 30px;
            padding-top: 5px;
            padding-left: 5px;
            overflow: hidden;
            float: left;
        }

        .i2 {
            width: 20px;
            height: 20px;
            padding-left: 25px;
            padding-top: 5px;
        }

        .d3 {
            padding-left: 200px;
            font-size: 20px;
        }

        .a3 {
            color: black;
            text-decoration: none;
            padding-left: 25px;
        }

        p {
            color: #aea6a8;
        }

        .i3 {
            width: 20px;
            height: 20px;
            position: relative;
            right: 80px;
        }

        button {
            height: 40px;
            width: 120px;
            padding-left: 5px;
            padding-top: 5px;
            margin-top: 30px;
            margin-left: 40px;
        }

        .i4 {
            padding-bottom: 50px;
            padding-right: 70px;
        }

        .p1 {
            color: #e01308;
            position: relative;
            bottom: 71px;
            left: 15px;
        }

        .d4 {
            width: 15px;
            height: 15px;
            background-color: #e01308;
            border-radius: 50%;
            position: relative;
            top: 32px;
            left: 80px;
        }

        .p2 {
            color: #fff;
            font-size: 10px;
            text-align: center;
        }

        .i5 {
            width: 80px;
            height: 80px;
        }
    </style>
</head>

<body>
    <!-- <ul>
        <li class="l1">
            <img src="../img/daohang.svg">
            <a href="#">黑龙江</a>
            &nbsp;
            <a href="#">切换至企业版</a>
            <select name="酒与事">
                <option value="酒与事" selected>酒与事</option>
            </select>
            <a href="#">|&nbsp;</a>
            <a href="#">我的订单</a>
            <select name="我的京东" class="sl1">
                <option value="我的京东" selected>我的京东</option>
            </select>
            <a href="#">|&nbsp;</a>
            <a href="#" class="a2">企业采购</a>
        </li>     
    </ul> -->
    <div style="float: left;">
        <img src="../img/jingdong.png" style="vertical-align: middle;" width: 200px class="img1">
        <div class="d1">
            <img src="../img/搜索.svg" class="i2">
            <img src="../img/照相机.svg" class="i3">
            <div class="d2">
                <p>console线</p>
                <!-- <img src="../img/照相机.svg" class="i3"> -->
            </div>
        </div>
        <div class="d4">
            <p class="p2">0</p>
        </div>
        <button><img src="../img/购物车.svg" class="i4">
            <p class="p1">我的购物车</p>
        </button>
        <img src="../img/二维码.png" class="i5">
    </div>
    <div class="d3">
        <a href="#" class="a3">全民运动季</a>
        <a href="#" class="a3">企业会员</a>
        <a href="#" class="a3">大牌奥莱</a>
        <a href="#" class="a3">京东家电</a>
        <a href="#" class="a3">京东生鲜</a>
        <a href="#" class="a3">京东手机</a>
        <a href="#" class="a3">京东超市</a>
        <a href="#" class="a3">拍卖</a>
        <a href="#" class="a3">电脑数码</a>
        <a href="#" class="a3">京东五金城</a>
    </div>
</body>

</html>